<template>
    <div>
        <el-dialog :title="optionsOneList.title" :visible.sync="optionsOneList.dialogFormVisible">
            <el-form :rules="rules" :module="optionsList">
                <el-form-item label="活动名称" label-width="'80px'" prop="cat_name">
                    <el-input autocomplete="off" v-model="optionsList.cat_name"></el-input>
                </el-form-item>
                <el-form-item label="活动区域" :label-width="'80px'">
                    <el-cascader :options="options" :props="props" v-model="cascader"></el-cascader>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="optionsOneList.dialogFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="submit">确 定</el-button>
            </div>
        </el-dialog>
    </div>
</template>


<script>
import { addList } from '@/utils/categories'
export default {
    props: {
        options: Array,
        optionsOneList: Object,
        optionsList: Object
    },
    data() {
        return {
            rules: {
                cat_name: [
                    { required: true, message: '请输入活动名称', trigger: 'blur' }
                ]
            },
            props: {
                label: 'cat_name',
                value: 'cat_id'
            },
            cascader: []
        }
    },
    methods: {
        async submit() {
            // console.log(this.optionsList);
            // console.log(this.cascader);
            if (this.optionsOneList.type == 'add') {
                if(this.cascader.length==0){
                    this.optionsList.cat_pid=0
                }else{
                    this.optionsList.cat_pid=this.cascader[length - 1]
                }
                this.optionsList.cat_level=this.cascader.length
                let { data: res } = await addList(this.optionsList)
                this.optionsOneList.dialogFormVisible=false
                if(res.meta.status==201){
                    this.$emit('one',res.data)
                    this.$message.success(res.meta.msg)
                    this.$emit('suibian')
                }else{
                    this.$message.error(res.meta.msg)
                }
            }
        }
    }
}
</script>